html {
  // font-size: (540px / 20) !important;
}

.flex {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

a {
  text-decoration: none;
  color: #666;
}

li {
  list-style: none;
}

@font-face {
  font-family: 'icomoon';
  src: url('fonts/icomoon.eot?qn6uhr');
  src: url('fonts/icomoon.eot?qn6uhr#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?qn6uhr') format('truetype'),
    url('fonts/icomoon.woff?qn6uhr') format('woff'),
    url('fonts/icomoon.svg?qn6uhr#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

body {
  margin: 0 auto;
  width: 100%;
  // height: 111.1111rem;
  min-width: 11.8519rem;
  max-width: 20rem;
  background-color: #f2f2f2;
  font-size: .5556rem;
  border: .037rem solid #ccc;
  border-left: transparent;
  border-right: transparent;
}

// nav部分开始
nav {
  position: fixed;
  top: 0;
  display: flex;
  padding-left: .3704rem;
  width: 20rem;
  height: 1.6667rem;
  border: .037rem solid #ccc;


  .nav-left {
    flex: 1;
    margin: .3704rem 0;
    // background-color: pink;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 0 5px;
    background-color: #fff;
    font-size: .4815rem;


    a {
      display: block;
      margin-top: 3px;
    }


    a::before {

      margin: 0 .1852rem;
      content: "\e900";
      font-family: 'icomoon';
    }
  }

  .nav-right {
    padding-bottom: 2px;
    width: 1.6667rem;
    height: 1.6667rem;
    font-size: .4815rem;
    text-align: center;

    a::before {
      content: "";
      display: block;
      margin: 0 auto;

      width: .9259rem;
      height: .9259rem;
      background: url(../images/sprite.png) no-repeat -2.1481rem -7.2222rem;
      background-size: 3.8519rem auto;

    }


  }
}

// nav部分结束

// focus部分开始
.focus {
  margin-top: 1.6667rem;
  width: 100%;
  height: 4.0741rem;

  .focus-img {
    width: 20rem;
    height: 4.0741rem;

  }
}

// focus部分结束

// section1部分开始
.section1 {
  display: flex;
  // flex-wrap: wrap;
  margin-top: .1852rem;
  width: 100%;
  height: 2.4074rem;
  background-color: #fff;

  li {
    flex: 1;

    a {
      display: flex;
      flex-direction: column;
      // justify-content: center;
      align-items: center;
      font-size: .4444rem;
    }

    a span:first-child {
      margin-top: .2963rem;
      display: inline-block;
      width: 1.1111rem;
      height: 1.1111rem;
      background: url(../images/localnav_bg.png) no-repeat 0 -2.2222rem;
      background-size: 1.1111rem auto;

    }
  }
}

// section1部分结束

// seciton2开始
.section2 {
  margin-top: .1852rem;
  display: flex;
  width: 20rem;
  height: 3.3333rem;
  background: -webkit-linear-gradient(left, #fa5a56, #fa7353, #fa974d);
  font-size: .4815rem;
  color: white;

  div {
    flex: 1;
    display: flex;
    flex-direction: column;


  }

  div[class="section2-left"] {
    justify-content: center;
    align-items: center;




    span:nth-child(2) {
      display: inline-block;
      width: 4.4815rem;
      height: 1.7037rem;
      background: url(../images/hotel.png) no-repeat;
      background-size: 4.4815rem auto;

    }
  }

  div:nth-child(n+2) span {

    text-align: center;
    line-height: 1.6667rem;
    flex: 1;
    border: .037rem solid white;

  }
}

// section2结束

// section3开始
.section3 {
  margin-top: .1852rem;
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
  font-size: .4444rem;

  div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    width: 4rem;

    a::before {
      content: "";
      display: block;
      width: 48px;
      height: 37px;
      background: url(../images/subnav-bg.png) no-repeat;

    }

  }
}

// section3结束

// active开始
.active {
  margin-top: .1852rem;
  background-color: #fff;

  .active-top {
    height: 1.6667rem;
    border-top: .037rem solid #f2f2f2;
    border-bottom: .037rem solid #f2f2f2;

    .left {
      display: inline-block;
      margin: .1852rem 0 0 .3704rem;
      width: 2.7037rem;
      height: .5926rem;
      vertical-align: middle;

      background: url(../images/hot.png) no-repeat -0.0741rem -0.7407rem;
      background-size: auto 2.1481rem;
    }

    .mid {
      margin-top: .1852rem;
      display: inline-block;
      height: .5926rem;
      width: 1.4815rem;
      background-color: #d9d9d9;
      color: #f7f7f7;
      line-height: .5926rem;
      text-align: center;
      font-size: .4444rem;
    }

    .right {
      margin: .1852rem .3704rem 0 0;
      float: right;
      width: 3.7037rem;
      height: .7407rem;
      border-radius: .1852rem;
      background: -webkit-linear-gradient(#ff516c, #ff5782, #ff6ac2);
      font-size: .5185rem;
      text-align: center;
      color: white;


      &::after {
        content: "\e903";
        font-family: 'icomoon';

      }
    }
  }

  .active-bottom-top {
    display: flex;
    width: 20rem;
    height: 7.037rem;

    a {
      flex: 1;

      img {
        width: 100%;
        height: 100%;
      }
    }

  }

  .active-bottom-mid {
    display: flex;
    width: 20rem;
    height: 4.2593rem;

    a {
      flex: 1;

      img {
        width: 100%;
        height: 100%;
      }
    }

  }

  .active-bottom-bottom {
    display: flex;
    width: 20rem;
    height: 4.2593rem;

    a {
      flex: 1;

      img {
        width: 100%;
        height: 100%;
      }
    }

  }

}

// active 结束

// footer部分开始

footer {
  display: flex;
  margin-top: .1852rem;
  height: 1.8519rem;
  background-color: #fff;

  div:first-child span:first-child {
    display: inline-block;
    width: .7407rem;
    height: .7407rem;
    background: url(../images/sprite.png) no-repeat -2.1481rem -5.6667rem;
    background-size: 3.8519rem auto;
  }

  div:nth-child(2) span:first-child {
    display: inline-block;
    width: .7407rem;
    height: .7407rem;
    background: url(../images/sprite.png) no-repeat -2.1481rem -6.4444rem;
    background-size: 3.8519rem auto;
  }

  div:nth-child(3) span:first-child {
    display: inline-block;
    width: .7407rem;
    height: .7407rem;
    background: url(../images/sprite.png) no-repeat -2.1481rem -11.4444rem;
    background-size: 3.8519rem auto;
  }

}

// footer部分结束